<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <button class="add">+</button>
  <button class="sub">-</button>
  <h2 class="counter">0</h2>

  <script>
    var addEl = document.querySelector(".add")
    var subEl = document.querySelector(".sub")
    var h2El = document.querySelector(".counter")

    var counter = 0

    addEl.onclick = function () {
      h2El.textContent = counter++
    }
    subEl.onclick = function () {
      h2El.textContent = counter--
    }

    var age = 18
    function foo() {
      age++
    }
    foo()
    console.log(age)

  </script>
</body>

</html>